<template>
    <div class="page borderbox w100 h100 absolute flex col pl10 pr10">
        <p class="fs18 lh22 bold textL mb20 info">请绑定账号，<br>便于下次快速登陆</p>
        <div class="whiteBg br5 relative p10 section">
            <input type="text" placeholder="请输入用户名" class="mb4" v-model="userName">
            <div class="vux-1px-b"></div>
            <input type="number" placeholder="请输入手机号码" class="mb4" v-model="userPhone">
            <!-- <div class="vux-1px-b"></div>
            <input type="text" placeholder="请输入验证码" class="mt4" v-model="userRegNumber">
            <span :class="['absolute','r15','b15','pl12','pr12','h22','lh22','fs12','br10',endTime!=0?'garyBg':'']" @click.stop="getRegNumber">{{!endTime ? '获取验证码' : ('获取验证码 ('+endTime+')')}}</span> -->
        </div>
        <span class="mt20 footer h30 lh30 br20" @click.stop="sureBind">完成绑定</span>
    </div>
</template>
<script>
import { Toast } from 'mint-ui';
import { isPhoneNum } from 'methods/common';
import { bindUserInfoPhone,bindPhoneSendSms } from 'request';
export default {
    name:'bindPhone',
    data(){
        return {
            userName:'',
            userPhone:'',
            userRegNumber:'',
            endTime:0,
        }
    },
    created(){
        this.$store.commit('increment',"绑定手机号");
    },
    methods:{
        getRegNumber(){
            if(!isPhoneNum(this.userPhone)){
                Toast({message:'请输入正确的手机号'});
            }else if(this.endTime != 0){
                let self = this;
                self.endTime = 60;
                self.interval = setInterval(function(){
                    self.endTime -= 1;
                    self.endTime == 0 && clearTimeout(self.interval)
                },1000)
                return
                //获取验证码部分
                bindPhoneSendSms({phone: this.phoneTxt_phone}).then(res=>{
                    if(res.rspCode == '0000' && res.data.resultCode == '0000'){
                        res.resRegCode = res.data.verifyCode;
                    }else{
                        
                    }
                })
            }
        },
        //完成绑定
        sureBind(){
            if(!this.userName){
                Toast({message:'请输入用户名',position:'middle',duration:1500});
            }else if(!isPhoneNum(this.userPhone)){
                Toast({message:'请输入正确的手机号码',position:'middle',duration:1500});
            // }else if(!this.userRegNumber){
            //     Toast({message:'请输入正确的短信验证码',position:'middle',duration:1500});
            }else{
                this.userName = this.userName.trim();
                bindUserInfoPhone({phone:this.userPhone,name:this.userName}).then(res=>{
                    if (res.rspCode == "0000") {
                        Toast({ message: "绑定成功", position: "middle", duration: 2000 });
                        this.$store.commit("changeRegState",true);
                        this.$router.go(-1);
                    } else {
                        Toast({ message: '注册失败', position: "middle", duration: 2000 });
                    }
                }).catch(err=>{
                    Toast({message:'绑定失败',position:'middle',duration:1500});
                })
            }
        }
    }
}
</script>
<style lang="less" scoped>
@import './index.less';
</style>
